<template>
  <div class="map-view">
    <div id="main"></div>
  </div>
</template>

<script setup>
import geoJson from '@/assets/data.json'
import echarts from 'echarts'
import { onMounted } from 'vue'
import map from '@/utils/map'

onMounted(() => {
  let myChart = echarts.init(document.getElementById('main'))
  // 注册可用地图
  echarts.registerMap('china', geoJson)
  let option = map
  myChart.setOption(option)
})
</script>

<style lang="less">
.map-view {
  width: 100%;
  #main {
    width: 100%;
    height: 600px;
    text-align: center;
  }
}
</style>